.landing-ui-field-color-primary {
    cursor: pointer;
    user-select: none;
    display: flex;
	margin-bottom: 14px;
}

.landing-ui-field-color-primary-preview {
    display: block;
    width: 16px;
    height: 16px;
    border-radius: 2px;
    background: var(--primary);
    margin-right: 7px;
	position: relative;
}

.landing-ui-field-color-primary.active .landing-ui-field-color-primary-preview::before {
	content: '';
	position: absolute;
	right: -4px;
	bottom: -3px;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background-image: url("data:image/svg+xml,%3Csvg width='15' height='15' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Crect fill='%23FFF' width='14.819' height='14.819' rx='7.409'/%3E%3Cpath fill='%232FC6F6' d='M6.593 8.333l4.19-4.141 1.39 1.44-5.559 5.56-.021-.023-.022.023-3.398-3.415 1.39-1.44z'/%3E%3C/g%3E%3C/svg%3E");
	box-shadow: 0 2px 4px 0 rgba(0,0,0,.11);
}

.landing-ui-field-color-primary-text {
	font: 12px var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
	font-weight: var(--ui-font-weight-regular, 400);
	color: #525c69;
	opacity: .34;
	user-select: none;
	transition: opacity .3s;
	white-space: nowrap;
}
.landing-ui-field-color-primary-text:hover {
	opacity: 1;
}
